<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="f"  uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h"  uri="http://java.sun.com/jsf/html"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<f:view>
<b>
<h:outputText value="USER DETAILS FORM"> </h:outputText>
</b>
<p>
         <h:messages style="color: blue"/>
         
</p>
 <h:form id="userDetailsForm">
 <h:panelGrid  columns="2">
 <h:outputText value="Name :"></h:outputText>
 <h:inputText id="name"  value="#{userDetails.name}" 
     required="true"
  requiredMessage="Please enter your Name"
  validatorMessage="Please enter more than 3 characters for name">
  <f:validateLength minimum="3"/>
  </h:inputText>
  
   <h:outputText value="Age"></h:outputText>
  <h:inputText id="age" value="#{userDetails.age}" required="true" requiredMessage="Please enter your age"
  validatorMessage="Please enter correct age ">
   <f:validateLength maximum="3"/> 
   </h:inputText> 
   
    <h:outputText value="Email"></h:outputText>
  <h:inputText id="email" value="#{userDetails.email}" required="true"
  requiredMessage="Please enter your email"></h:inputText> 
  
   <h:outputText value="Date Of Birth"></h:outputText>
  <h:inputText id="dob" value="#{userDetails.dob}"
  required="true"
  requiredMessage="Please enter your Date Of Birth"
  converterMessage="Please enter the date in MM/DD/YYYY">
  <f:convertDateTime type="date" pattern="MM/dd/yyyy"/> 
  </h:inputText>   
  
  </h:panelGrid>
  <h:commandButton value="Submit" action="#{userDetails.submitUserDetails}"></h:commandButton>
  </h:form>
  <h:panelGrid rendered="#{userDetails.submitted != false}" >
  <h:outputLabel value="User Details submitted successfully"></h:outputLabel>
 </h:panelGrid>

</f:view>
</body>
</html>
